Fancybox
Fancybox is the ultimate JavaScript lightbox alternative that sets the standard for premium user experience in multimedia display. Supports images, videos, maps, inline content, iframes and any other HTML content.
This is the fifth generation of Fancybox. Both Carousel and Panzoom components are used under the hood and that's what makes this project so unique. In addition, Fancybox is easy to integrate into any JavaScript framework, see samples for React, Vue and Angular.
Key Features
- Written in TypeScript, no external dependencies
- Highly customizable with plenty of configuration options and CSS variables
- Touch and mobile optimized with swipe, drag and pinch-to-zoom gestures
- Multiple opened (active) instances at the same time
- Two types of thumbnails - classic and modern new
- Compact mode with a mobile-like user experience new
- Various transformation controls new
- Supports
<picture>
element new - Can handle gallery with infinite items new
- Idle state new
- Mouse panning new
- Focus trap
Examples
Basic example
Transformation controls
Mouse panning
Videos
Various
Combine
You don't need to do any additional steps to combine Carousel with Fancybox. They will be automatically synced, no additional code is required.
What's Next
See the Showcase page for more detailed examples. Check out additional samples on the corresponding plugin page, for example:
- Images plugin for images;
- HTML plugin for HTML, inline content, videos, iframes, etc.
For installation and use instructions, see Get Started page.